<template>
  <div>
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/' }">
        <i class="el-icon-s-promotion"></i>后台管理
      </el-breadcrumb-item>
      <el-breadcrumb-item>{{$router.currentRoute.name}}</el-breadcrumb-item>
    </el-breadcrumb>
    <el-divider></el-divider>
    <div style="margin-bottom: 20px;">
      <el-button type="primary" size="medium"
                 @click="$router.push('/sys-admin/serve/ticket-list/add-new')">添加退票</el-button>
    </div>

    <el-table :data="tableData" stripe border style="width: 100%">
      <el-table-column prop="title" label="车展名称" header-align="center" show-overflow-tooltip></el-table-column>
      <el-table-column prop="orderNo" label="订单号" width="250" header-align="center" show-overflow-tooltip></el-table-column>
      <el-table-column prop="id" label="ID" width="100" align="center"></el-table-column>
      <el-table-column prop="num" label="购票数" width="100" align="center" show-overflow-tooltip></el-table-column>
      <el-table-column prop="price" label="票价" width="100" align="center" show-overflow-tooltip></el-table-column>
      <el-table-column prop="payStatus" label="支付状态" :formatter="statusFormatter" header-align="center" show-overflow-tooltip></el-table-column>
      <el-table-column prop="returnTime" label="退票截止时间" width="180" align="center" show-overflow-tooltip></el-table-column>


      <el-table-column label="操作" width="150" align="center">
        <template slot-scope="scope">
          <el-button size="small" icon="el-icon-check" circle type="success"
                     @click="openReviewConfirm(scope.row,1)"></el-button>
          <el-button size="small" icon="el-icon-close" circle type="info"
                     @click="openReviewConfirm(scope.row,0)"></el-button>
        </template>
      </el-table-column>
    </el-table>
    <div style="margin: 10px auto;text-align: right;">
      <el-pagination
          @current-change="changePageNum"
          layout="total, prev, pager, next"
          :total="total"
          :page-size="pageSize"
          :current-page="currentPage">
      </el-pagination>
    </div>
  </div>
</template>
<script>
import global from '../../../Global'
let preTicketListUrl = global.preTicketLists ;

export default {
  data() {
    return {
      tableData: [],
      total: 0,
      pageSize: 0,
      currentPage: 1,
      payStatusText: ["未付款", "已付款", "待退款", "已退款", "退款失败"]
    }
  },
  methods: {
    statusFormatter(row, column){
      return this.payStatusText[row.payStatus];
    },
    //购票列表退款确认提示
    openReviewConfirm(ticketList,num) {
      let text = '同意';
      if(num==0){text='拒绝';}

      this.$confirm('是否【' + text + '】订单【 ' + ticketList.orderNo + ' 】中【 ' + ticketList.id + ' 】的退款申请?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.handleReview(ticketList,num);
      }).catch(() => {
      });
    },
    //购票列表退款
    handleReview(ticketList,num){
      let text = '同意';
      let mUrl = '/pay-refund';
      if(num==0){text='拒绝';mUrl='/pay-refund-fail';}

      let url = preTicketListUrl + "/" + ticketList.id + mUrl;

      let localJwt = localStorage.getItem('localJwt');
      this.axios.create({'headers': {'Authorization': localJwt}})
          .post(url).then((response) => {
        let jsonResult = response.data;
        if(jsonResult.state == 20000){
          this.$notify.success({title: '成功',
            message: text+'退款审核通过'
          });
          this.loadPayRefundTicketListList();
        }else if(jsonResult.state == 40400){
          this.$alert(jsonResult.message, '错误', {
            confirmButtonText: '确定',
            callback: action => {
              this.loadPayRefundTicketListList();
            }
          });
        }else if(jsonResult.state == 40100){
          this.$alert(jsonResult.message, '错误', {
            confirmButtonText: '确定',
            callback: action => {
              localStorage.removeItem("localJwt");
              this.$router.push("/login");
            }
          });
        }else{
          this.$alert(jsonResult.message, '错误', {
            confirmButtonText: '确定',
            callback: action => {
              this.loadPayRefundTicketListList();
            }
          });
        }
      });
    },
    //分页——翻页
    changePageNum(value){
      this.$router.replace("?pageNum="+value);
      this.loadPayRefundTicketListList();
    },
    //加载退款申请列表
    loadPayRefundTicketListList(){
      let pageNum = this.$router.currentRoute.query.pageNum;
      if(!pageNum){
        pageNum = 1;
      }

      let url = preTicketListUrl+"/pay-refund?pageNum="+ pageNum;
      let localJwt = localStorage.getItem('localJwt');
      this.axios.create({'headers': {'Authorization': localJwt}})
          .get(url).then((response) => {
        let jsonResult = response.data;
        if(jsonResult.state == 20000){
          this.tableData = jsonResult.data.list;
          this.total = jsonResult.data.total;
          this.pageSize = jsonResult.data.pageSize;
          this.currentPage = jsonResult.data.currentPage;
        }else{
          this.$alert(jsonResult.message, '错误', {
            confirmButtonText: '确定',
            callback: action => {
            }
          });
        }
      });
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
    }
  },
  mounted() {
    this.loadPayRefundTicketListList();
  }
}
</script>
<style>
.el-transfer-panel{
  width:260px !important;
}
</style>